<!DOCTYPE html>
<html>
<head>
	<title>王禹的简历</title>
	<link rel="stylesheet" href="a.css">
	<script src="http://at.alicdn.com/t/font_1164850_ko957hgm2t.js"></script>
	<style type="text/css">
		.icon {
		   width: 1em; height: 1em;
		   vertical-align: -0.15em;
		   fill: currentColor;
		   overflow: hidden;
		}
	</style>
</head>
<body>
<div class="topNavBar " >
	<div class="barlinner clearfix">
			<a href="#" class="logo" >
					<span class="rs">RS</span><span class="card">card</span>
			</a>
			<nav>
				<ul>
					<li ><a href="#">ABOUT</a></li>
					<li ><a href="#">SKILLS</a></li>
					<li ><a href="#">EXPERIENCE</a></li>
					<li ><a href="#">PRICING</a></li>
					<li ><a href="#">BLOG</a></li>		
				</ul>
			</nav>
	</div>
</div>

<div class="banner">
	<div class="mask"></div>
</div>

<main>
	<div class="usercard clearfix">
		 <div class="pic">
		 	
		 </div>
		<div class="profile">
			<div class="welcome">
				<span class="hello">HELLO</span>
			    <div class="angel"></div>
			</div>
		</div>
		<div class="self">
			<h1><span>I'm</span>WangYu</h1>
            <p>前端工程师</p>
			<hr>
			
				<table>
					
					<tr>
					<th>年龄</th>
            	<td>25</td>	
					</tr>
            	<tr>
					<th>地址</th>
            	<td>xxxxxxxxx</td>
				</tr>
            	<tr>
					<th>电话</th>
            	<td>xxxxxxxxx</td>
				</tr>
            	<tr>
					<th>E-MAIL</th>
            	<td>xxxxxxxxxxxxx</td>
				</tr>
            	
				</table>
		</div>
		<footer class="media">
				<div class="iconall">
						<a href="" alt="...">
								<svg class="icon" aria-hidden="true">
								<use xlink:href="#icon-weibo"></use>
								</svg>
							</a>
							<a href="" alt="...">
								<svg class="icon" aria-hidden="true">
								<use xlink:href="#icon-web-icon-"></use>
								</svg>
							</a>
							<a href="" alt="...">
								<svg class="icon" aria-hidden="true">
								<use xlink:href="#icon-zhihu"></use>
								</svg>
							</a>
							<a href="" alt="...">
								<svg class="icon" aria-hidden="true">
								<use xlink:href="#icon-weixin"></use>
								</svg>
							</a>
							<a href="" alt="...">
							  <svg class="icon" aria-hidden="true">
							  <use xlink:href="#icon-github"></use>
							  </svg>
						   </a>
				
				</div>
		</footer >
	
	</div>

	<div class="download">
		<a href="#">DOWNLOAD RESUME</a>
	</div>

	<p class="text">
	Hello! I’m Robert Smith. Senior Web Developer specializing in front end development. Experienced with all stages of the development cycle for dynamic web projects. Well-versed in numerous programming languages including JavaScript, SQL, and C. Stng background in project management and customer relations.
    </p>
</main>

<section>
	<h2>Professional Skills</h2>
	<ol>
		<li>HTML 5 &amp; CSS 3</li>
		<li>JavaScript</li>
		<li>jQuery</li>
		<li>Vue</li>
		<li>React</li>
		<li>HTTP</li>
	</ol>
</section>

<section>
	<h2>作品集</h2>
	<nav>
			<p>所有</p>
			<p>原生JS</p>
			<p>框架</p>
			<p>其他</p>				
	</nav>
	<div class="works">
		<div class="big"></div>
		<div class="small"></div>
		<div class="small"></div>
	</div>
</section>

</body>
</html>